<template>
  <page class="Metype" :top="0" :bottom="0">
    <van-nav-bar title="订单状态" left-text="返回" left-arrow @click-left="back()" />

    <van-tabs v-model:active="wdtypeid.id" @click-tab="typemethod(wdtypeid.id)">
      <van-tab v-for="v, i in typelist" :key="i" :title="v.title">
        <img src="../../public/img/noLogin.png" v-if="typelist[wdtypeid.id].conster.length== null">

        <div>
          <van-card v-for="v, i in typelist[wdtypeid.id].conster" @click="push({ name: 'info', query: { id: v.wares_id } })"  :key="i" :num="v.goods_num" :price="v.goods_price" :desc="v.wares_info" :title="v.wares_title"
            :thumb="v.wares_infoimg[0]" >
            <template #footer>
              <div>总计：{{v.goods_totalprice }}</div>
            </template>
          </van-card>
        </div>
       
      </van-tab>

    </van-tabs>

  </page>
</template>
  
<script setup lang="ts">

import { useRouterAction } from "@/utils/router";
import { orderallOrder } from "@/serve/_";
import { VagueOject ,typee} from "@/types/common";
import { onMounted, ref, reactive } from "vue";
const { route,push,back } = useRouterAction()
const wdtypeid: { id: number } = reactive({ id: 0 })
const typelist: {
  title: string,
  id: string,
  conster:any[]
}[] = reactive([{
  title: "全部订单",
  id: "-1",
  conster: []
}, {
  title: "待付款",
  id: "0",
  conster: []
}, {
  title: "待发货",
  id: "1",
  conster: []
}, {
  title: "待收款",
  id: "2",
  conster: []
}, {
  title: "退款/售后",
  id: "3",
  conster: []
},
])

onMounted(async () => {
  wdtypeid.id = Number(route().query.id) + 1
  typelist[wdtypeid.id].conster= await orderallOrder({
    status: (wdtypeid.id - 1).toString()
  })
  console.log(typelist)
})

//点击添加
const typemethod = async (id: number) => {
  console.log("id", typelist[id].conster.length == 0)


  if (typelist[id].conster.length == 0) {

    typelist[id].conster = await orderallOrder({
      status: (id - 1).toString()
    })
    console.log(555)
    console.log(typelist)

  } else {
    console.log(666)
  }

  console.log(typelist)
}

const onClickLeft = () => {

}
console.log(route().query.id)
</script>
  
<style scoped lang="less" ></style>